<template>
	<view>
		<view class="f-btm">
			<view class="btm-btm-box u-flex">
				<view class="menu-item text-center u-flex flex-col u-m-r-8">
					<image class="img-36" :src="$staticPath('classify/contact.png')"></image>
					<view>{{$t('classify.客服')}}</view>
				</view>
				<view class="buy-btn-box u-flex e-flex-1 ">
					<button class="buy c-white" @tap="$emit('buy')">{{$t('classify.立即购买')}}</button>
				</view>
			</view>
			<view class="ios-btm"></view>
		</view>
		<view style="height: 144rpx;"></view>
		<view class="ios-btm"></view>
	</view>
</template>

<script setup lang="ts">
import { useInit } from '@/common/stores';
import { useCurrentInstance } from '@/common/hooks';

const props = defineProps({
	info:Object
});

const ctx = useCurrentInstance();
const {setTabbarPageIndex} = useInit()

const backHome = () => {
	setTabbarPageIndex(0);
	ctx.$switchTab('/pages/tabbar/index');
};
</script>

<style lang="scss" scoped>
	.f-btm {
		position: fixed;
		bottom: 0;
		width: 100vw;
		z-index: $z-index-high;
		background-color: #FFFFFF;

		.btm-btm-box {
			height: 124rpx;

			.menu-item {
				padding: 0 32rpx;
				color: #666666;
				>view{
					@include fontH(22, 32);
					margin-top: 10rpx;
				}
			}

			.buy-btn-box {
				padding-right: 28rpx;
				button {
					flex: 1;
					height: 88rpx;
					line-height: 88rpx;
					text-align: center;
					font-size: 28rpx;
					font-weight: 600;
					padding: 0;
				}

				.buy {
					background: var(--color-primary);
					border-radius: 40rpx;
				}
			}
		}
	}
</style>
